import React from 'react';
import PropTypes from 'prop-types';
import cn from 'classnames';
import s from './Box.module.css';

export default function Box({
	className,
	headerClass,
	title,
	headerLeft,
	children,
}) {
	return (
		<div className={cn(className, s.box)}>
			<header className={headerClass}>
				<div className={s.title}>{title}</div>
				<div className={s.headerLeft}>{headerLeft}</div>
			</header>
			{children}
		</div>
	);
}

Box.propTypes = {
	className: PropTypes.string,
	headerClass: PropTypes.string,
	title: PropTypes.node,
	headerLeft: PropTypes.node,
	children: PropTypes.node,
};

Box.defaultProps = {
	className: s.box,
	headerClass: '',
};
